﻿@model IEnumerable<Capstone_20130302.Models.Product>

@{
    ViewBag.Title = "Product Management";
    Layout = "~/Views/Shared/_AdminLayout.cshtml";
    var EditorPicks = ViewBag.EditorPicks;
}
<script src="~/Scripts/jquery.dataTables.js"></script>
<script src="~/Scripts/dataTables.bootstrap.js"></script>


<script type="text/javascript" charset="utf-8">

    $(document).ready(function () {
        $('#example').dataTable({
            "sDom": "<'row spare-down'<'span4'f><'span3'l>r>t<'row'<'span3'i><'span8'p>>",
            "sPaginationType": "bootstrap",
            "oLanguage": {
                "sLengthMenu": "_MENU_ records per page"
            }
        });

        function updateProductStatus(pid, stt) {
            $.ajax({
                url: "/Admin/UpdateProductStatus",
                type: 'POST',
                data: { productID: pid, status: stt },
                success: function (response) {
                    if (response == "OK") {
                        $('#status-' + pid).text(stt);
                        notify({ title: "Update Success", content: "The status has been updated." });
                    }
                    else {
                        notify({ title: "Fail to Update", content: "The system has fail to update, please try again." });
                    }
                }
            });

            //$('#regisModal').find('input#regis').click();
        }

        $(".changeStatus").change(function () {
            var productID = $(this).data("pid");
            //alert(productID);
            var status = $('#n-status-' + productID + ' option:selected').text();
            //alert(status);
            updateProductStatus(productID, status);
        });

        $(".addPick").click(function () {
            var c=confirm("Are you sure to add this item to Editor's Picks?")
            if (c==true) {
                var pid = $(this).data("pid");
                //alert(productID);

                $.ajax({
                    url: "/Admin/AddEditorPick",
                    type: 'POST',
                    data: { productID: pid },
                    success: function (response) {
                        if (response == "OK") {
                            notify({ title: "Update Success", content: "The product has been added to Editor's Picks.", url: "/" });
                            $(".addPick[data-pid='" + pid + "']").hide();
                            $(".minusPick[data-pid='" + pid + "']").show();
                        }
                        else {
                            notify({ title: "Request Error", content: "The system fails to process your request, please try again." });
                        }
                    }
                });
            }            
        });
        $(".minusPick").click(function () {
            var c=confirm("Are you sure to remove this item from Editor's Picks?")
            if (c == true) {
                var pid = $(this).data("pid");
                //alert(productID);
                $.ajax({
                    url: "/Admin/RemoveEditorPick",
                    type: 'POST',
                    data: { productID: pid },
                    success: function (response) {
                        if (response == "OK") {
                            notify({ title: "Update Success", content: "The product has been removed from Editor's Picks.", url: "/" });
                            $(".addPick[data-pid='" + pid + "']").show();
                            $(".minusPick[data-pid='" + pid + "']").hide();
                        }
                        else {
                            notify({ title: "Request Error", content: "The system fails to process your request, please try again." });
                        }
                    }
                });
            }
        });
    });
</script>


@if (Model.ToList().Count > 0)
{
    <div class="form-inline data-content">
        <table cellpadding="0" cellspacing="0" border="0" class="display table table-striped table-bordered" id="example">
            <thead>
                <tr>
                    <th>Product Name
                    </th>
                    <th>Store Name
                    </th>
                    <th>Create Date
                    </th>
                    <th>Status
                    </th>

                    <th>Action </th>
                </tr>
            </thead>
            <tbody>

                @foreach (var item in Model)
                {
                    <tr>
                        <td>
                            @Html.DisplayFor(modelItem => item.Name)
                        </td>
                        <td>
                            @Html.DisplayFor(modelItem => item.Store.StoreName)
                        </td>
                        <td>
                            @Html.DisplayFor(modelItem => item.CreateDate)
                        </td>
                        <td data-pid="@item.ProductId" id= "status-@item.ProductId">
                            @Html.DisplayFor(modelItem => item.Status.Name)
                        </td>
                        <td data-pid="@item.ProductId">
                            <a href="/Product/Id/@item.ProductId"><i class="icon-search"></i> View</a>
                            <a href="#" data-pid="@item.ProductId" class="addPick"><i class="icon icon-plus-sign"></i> Pick</a>
                            <a href="#" data-pid="@item.ProductId" class="minusPick"><i class="icon icon-minus-sign"></i> Unpick</a>
                            @{
                                var found = false;
                            }
                            @foreach (var pick in EditorPicks)
                            {
                                if (pick.ProductId == item.ProductId)
                                {
                                    found = true;
                                }
                                
                            }
                            <script>
                                $(".addPick[data-pid='@item.ProductId']").hide();
                                $(".minusPick[data-pid='@item.ProductId']").show();
                            </script>   
                            @if (found == false)
                            {
                                <script>
                                    $(".minusPick[data-pid='@item.ProductId']").hide();
                                    $(".addPick[data-pid='@item.ProductId']").show();
                                </script> 
                            }
                            @Html.DropDownList("StatusID", (SelectList)ViewBag.StatusID, "- Update -", new { id = "n-status-" + @item.ProductId, @class = "changeStatus span2", data_pid = @item.ProductId })
                        </td>
                    </tr>
                }
            </tbody>

        </table>
    </div>
}
else
{
    <text>no product.</text>
}

<style>
    select {
        float: right !important;
    }
    th, td {
        vertical-align: middle !important;
    }
</style>